import {
	observer
} from 'mobx-react';
import {
	WeaTableNew
} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;

@observer
export default class Table extends React.Component {
	constructor(props) {
		super(props);
	}

	reRenderColumns = (columns) => {
		const {store} = this.props;
		const {
			edit,
			cPage
		} = store;

		if (cPage === 'queryDeductionMoney') {
			return columns;
		}

		columns.map(c => {
			if (['lastname', 'catalogue'].includes(c.dataIndex)) {
				c.render = function(text, record) {
					const {
						id,
						fid,
						catalogue,
					} = record;
					let name;
					if (cPage === 'recordInfo') {
						name = record.cataloguespan;
					} else {
						name = record.lastnamespan;
					}
					return <a onClick={() => edit(id,fid,catalogue)}>{name}</a>
				}
			}
			if (c.dataIndex === 'status') {
				c.render = function(text, record) {
					const {
						status,
						statusspan
					} = record;

					return <span style={{color:(status === '1') && '#ff0000'}}>{statusspan}</span>
				}
			}
		});
	}

	onOperatesClick = (record, rIndex, operate) => {
		const {store} = this.props;
		const {
			randomFieldId,
			fid,
			catalogue,
		} = record, {
			index
		} = operate;

		const {
			del,
			edit,
			cPage,
			abandon,
		} = store;

		if (index === '0') {
			edit(randomFieldId, fid, catalogue);
		} else {
			if (cPage === 'recordInfo') {
				abandon(randomFieldId);
			} else {
				del(randomFieldId);
			}
		}
	}

	render() {
		const {
			store
		} = this.props, {
			TABLE,
			table
		} = store;

		return (
			<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@c6h07l`} 
				{...TABLE}
				{...table}
				getColumns={this.reRenderColumns}
				onOperatesClick={this.onOperatesClick}
			/>
		);
	}
}